$(function () {
  //获取分类
  djVideo()
  async function djVideo() {
    const res = await axios({
      url: `/dj/catelist`,
      method: 'get'
    })
    let result = res.data.categories;
    result.forEach((item, index) => {
      $('.djvideo_boxes')[0].innerHTML += `
          <div class="djviedo_box cp" onclick="dj_vido(${item.id},${index})">
              <div class="djvideo_box_img" style="background-image: url(${item.picWebUrl});"></div>
              <div class="djvideo_detail">${item.name}</div>
          </div>  
      `
    })

    // 默认点击第1个
    dj_vido(e = '', 0)
  }
  // 分类获取电台
  djVideo_recommend(type = 3)

  //获取热门电台
  djVideo_comment()

})

// 绑定djvideo鼠标点击事件
function dj_vido(e, i) {
  let djv = $('.djviedo_box .djvideo_box_img')
  djv.each((index, item) => {
    item.classList.remove('djvideo_box_click_img')
    item.parentNode.classList.remove('djvideo_box_clikc_box')
    if (index == i) {
      item.classList.add('djvideo_box_click_img')
      item.parentNode.classList.add('djvideo_box_clikc_box')
    }
  })
  if (e) {
    djVideo_recommend(e)
    djVideo_comment(e)
  }
}

// 分类获取电台
async function djVideo_recommend(type) {
  const res = await axios({
    url: `/dj/recommend/type/?type=${type}`,
    method: 'get'
  })
  let result = res.data.djRadios;
  $('#dj_new')[0].innerHTML = ''

  if (!result.length) {
    $('#dj_new')[0].innerHTML = `
    <li style="text-align: center;font-size: 60px;margin: 60px auto;">列表为空</li>
  `
  }
  result.forEach((item, index) => {
    // 循环生成优秀新电台
    $('#dj_new')[0].innerHTML += `
      <li class="dj_new_ct" onclick="goToDjradioDetail(${item.id})">
          <dl>
              <img src="${item.picUrl}?param=150y150" alt="" srcset="">
              <dt class="dj_new_title_top"><a href='#'>${item.name}</a> </dt>
              <dd class="dj_new_title_bottom">${item.rcmdtext}</dd>
          </dl>
      </li>
      `
  })
}

//获取热门电台
async function djVideo_comment(cateId = 3) {
  const res = await axios({
    url: `/dj/radio/hot/?cateId=${cateId}`,
    method: 'get'
  })
  let result = res.data.djRadios;
  $('#dj_top')[0].innerHTML = '';
  if (!result.length) {
    $('#dj_top')[0].innerHTML = `
      <li style="text-align: center;font-size: 60px;margin: 60px auto;">列表为空</li>
    `
  }
  result.forEach((item, index) => {
    $('#dj_top')[0].innerHTML += `
      <li class="dj_top_ct fx_sb" onclick="goToDjradioDetail(${item.id})">
          <img src="${item.picUrl}?param=120y120" alt="">
          <div class="dj_top_ct_right">
              <div class="dj_top_ct_right_title"><a href="javascript:;">${item.name}</a></div>
              <p class="dj_er_name"><span>${item.dj.nickname}</span></p>
              <div class="fx_fs dj_top_detail">
                  <div>共${item.programCount}期</div>
                  <div>订阅${item.subCount}次</div>
              </div>
          </div>
      </li>
      `
  })
}

